import React, {useEffect,useRef} from 'react';
import { IPublicModelPluginContext } from '@alilc/lowcode-types';
import { PartitionOutlined } from '@ant-design/icons';
import MainPanel  from './main-panel';



const LowcodeBPMNPlugin = (ctx: IPublicModelPluginContext, options: any) => {
    return {
        // 插件的初始化函数，在引擎初始化之后会立刻调用
        init() {
            // 你可以拿到插件注册时的初始化参数
            // console.log(options.name);

            // 往引擎增加面板
            ctx.skeleton.add({
                area: 'leftArea',
                name: 'LowcodeBPMNPluginPane',
                type: 'PanelDock',
                props: {
                    icon: <PartitionOutlined style={{ fontSize: 'large' }} />,
                    description: '流程管理',
                },
                content: (<>
                    <MainPanel />
                </>),
                panelProps: {
                    floatable: true, // 是否可浮动
                    height: 300,
                    hideTitleBar: false,
                    maxHeight: 800,
                    maxWidth: 1000,
                    title: "流程管理",
                    width: 1500,
                },
            });

            ctx.logger.log('打个日志');
        },
    };
};

// 插件名，注册环境下唯一
LowcodeBPMNPlugin.pluginName = 'LowcodeBPMNPlugin';
LowcodeBPMNPlugin.meta = {
    // 依赖的插件（插件名数组）
    dependencies: [],
    engines: {
        lowcodeEngine: '^1.1.0', // 插件需要配合 ^1.1.0 的引擎才可运行
    },
}

export default LowcodeBPMNPlugin;
